<div class="modal-dialog" role="document">
    <div class="modal-content" tabindex="-1">
        <div class="modal-header">
            <button type="button" class="close" data-bind="click: cancel" aria-hidden="true">
                <i class="icon-cancel"></i>
            </button>
            <h4 class="modal-title">Generate New Replication Certificate (public & private keys)</h4>
        </div>
        <div class="modal-body">
            <p class="margin-top">
                This option generates a new certificate for the Hub & Sink tasks communication.<br>
                The Hub task keeps only the <strong>public key</strong>.<br>
                The <strong>private key</strong> is kept only on the Sink task.
            </p>
            <hr>
            <p>
                <i class="text-warning icon-warning"></i>
                <span>After the certificate is generated, save the private key for the Sink task definition by either one of the following:</span>
            </p>
            <ul>
                <li>
                    <strong>Export access configuration</strong><br>
                    <small>All your replication access configuration (including the certificate) will be downloaded to a JSON file.</small>
                </li>
                <li class="margin-top margin-top-sm">
                    <strong>Download generated certificate</strong><br>
                    <small>Only the certificate will be downloaded as a PFX file.</small>
                </li>
            </ul>
            <p class="text-info bg-info padding padding-xs margin-right margin-right-lg margin-top margin-bottom">
                <small><i class="icon-info"></i><span>Keep these files in a safe place. The private key isn't saved on the Hub task.</span></small>
            </p>
            <hr>
            <p class="margin-top">
                Please provide validity period for the generated certificate:
            </p>
            <div class="flex-form">
                <div class="form-group" data-bind="validationElement: validityInMonths">
                    <label class="control-label">Validity Period</label>
                    <div class="input-group btn-block">
                        <input type="number" min="1" class="form-control" data-bind="numericInput: validityInMonths" placeholder="Enter number of months" />
                        <div class="input-group-addon">months</div>
                    </div>
                </div>
            </div>
        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-default" data-bind="click: cancel">
                <i class="icon-cancel"></i>
                <span>Cancel</span>
            </button>
            <button type="button" class="btn btn-success" data-bind="click: generate">
                <i class="icon-magic-wand"></i>
                <span>Generate new certificate</span>
            </button>
        </div>
    </div>
</div>
